import flet as ft
import socket
import threading
import json


class ChatApp:
    def __init__(self):
        self.sock = socket.socket(socket.AF_INET, socket.SOCK_DGRAM)
        self.sock.bind(("0.0.0.0", 0))
        self.broadcast_addr = ("255.255.255.255", 12345)
        self.sock.setsockopt(socket.SOL_SOCKET, socket.SO_BROADCAST, 1)

    def main(self, page: ft.Page):
        page.title = "局域网聊天"
        page.window_width = 300
        page.window_height = 500
        page.padding = 0

        # 顶部用户信息区
        user_info = ft.Container(
            content=ft.Row(
                [
                    ft.Image(
                        src="avatar.png",
                        width=40,
                        height=40,
                        border_radius=ft.border_radius.all(20),
                    ),
                    ft.Column(
                        [
                            ft.Text("Kingston", size=16, weight=ft.FontWeight.BOLD),
                            ft.Text("专业写Bug", size=12),
                        ],
                        spacing=2,
                    ),
                ],
                spacing=10,
            ),
            padding=ft.padding.all(10),
            bgcolor="#F5F5F5",
        )

        # 搜索栏
        search_bar = ft.Container(
            content=ft.TextField(
                hint_text="搜索：联系人、多人聊天、群",
                border=ft.InputBorder.NONE,
                height=35,
                content_padding=ft.padding.only(left=10, right=10),
            ),
            padding=ft.padding.only(left=10, right=10, top=5, bottom=5),
        )

        # 分类标签栏
        tabs = ft.Container(
            content=ft.Row(
                [
                    ft.TextButton("好友", style=ft.ButtonStyle(color="black")),
                    ft.TextButton("群组", style=ft.ButtonStyle(color="black")),
                    ft.TextButton("最近", style=ft.ButtonStyle(color="black")),
                ]
            ),
            padding=ft.padding.only(left=10),
        )

        # 好友列表
        friends_list = ft.ListView(
            controls=[
                ft.Container(
                    content=ft.Row(
                        [
                            ft.Text("我的好友 0/3", size=12, color="#666666"),
                        ]
                    ),
                    padding=10,
                ),
                ft.Container(
                    content=ft.Row(
                        [
                            ft.Image(
                                src="avatar.png",
                                width=40,
                                height=40,
                                border_radius=ft.border_radius.all(20),
                            ),
                            ft.Column(
                                [
                                    ft.Text("我心飞扬(隔壁老王)", size=14),
                                    ft.Text(
                                        "把你放在心上，最美好的地方",
                                        size=12,
                                        color="#666666",
                                    ),
                                ],
                                spacing=2,
                            ),
                        ],
                        spacing=10,
                    ),
                    padding=10,
                ),
                ft.Container(
                    content=ft.Row(
                        [
                            ft.Image(
                                src="avatar.png",
                                width=40,
                                height=40,
                                border_radius=ft.border_radius.all(20),
                            ),
                            ft.Column(
                                [
                                    ft.Text("金刚互撩娃(bug砖家)", size=14),
                                    ft.Text(
                                        "写代码，我很快乐~", size=12, color="#666666"
                                    ),
                                ],
                                spacing=2,
                            ),
                        ],
                        spacing=10,
                    ),
                    padding=10,
                ),
            ],
            spacing=0,
            padding=0,
            expand=True,
        )

        # 底部工具栏
        bottom_bar = ft.Container(
            content=ft.Row(
                [
                    ft.IconButton(icon=ft.icons.MENU),
                    ft.IconButton(icon=ft.icons.PERSON),
                    ft.IconButton(icon=ft.icons.GROUP),
                    ft.IconButton(icon=ft.icons.SETTINGS),
                    ft.IconButton(icon=ft.icons.MORE_HORIZ),
                ],
                alignment=ft.MainAxisAlignment.SPACE_AROUND,
            ),
            padding=ft.padding.only(top=5, bottom=5),
            bgcolor="#F5F5F5",
        )

        # 主布局
        page.add(
            user_info,
            search_bar,
            tabs,
            friends_list,
            bottom_bar,
        )


if __name__ == "__main__":
    app = ChatApp()
    ft.app(target=app.main)
